// app global css in SCSS form
:root{
  --van-picker-confirm-action-color: #FFD101;
}
body,html{
  font-family: PingFangSC-Regular, PingFang SC ;
  color: #222;
}

.center{
  display: grid;
  place-content: center;
}
.flex-1{
  flex: 1 1 0;
}


.animate-spin{
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.line-height-1{
  line-height: 1;
}
.input-nostyle{
  background-color: transparent;
  border: none;
  outline: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0;
}
input[type="number"]{
  -moz-appearance: textfield;
}

.q-btn.disabled{
  opacity: 0.6 !important;
}

.van-action-sheet{
  $paddingY: 14px;
  .van-action-sheet__content{
    .van-action-sheet__item{
      border-bottom: 1px solid #cccccc52;
      padding: $paddingY var(--van-padding-md);
      &:nth-last-child(1){
        border-bottom: none;
      }
    }
  }
  .van-action-sheet__cancel{
    padding: $paddingY var(--van-padding-md);
  }

}
.van-picker__confirm{
  color: #FFD101 !important;
}


.van-popup.van-toast{
  z-index: 900000 !important;
}
.q-btn{
  transition-duration: 150ms;
}


.otp-input-container{
  justify-content: space-between;
}

.otp-input {
  width: 40px;
  height: 40px;
  padding: 5px;
  font-size: 20px;
  border-radius: 8px;
  background-color: #fff;
  text-align: center;
  border: none;
}
.otp-input.is-complete {
  background-color: #FFAD13;
  color: #fff;
  border: none;
}
.otp-input.error {
  border: 1px solid red !important;
}
.otp-input::-webkit-inner-spin-button,
.otp-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.font-DINAlternate{
  font-family: DINAlternate, DINAlternate;
}
